import React, { PureComponent } from 'react'
import {connect} from '../hoc'
import { increment } from '../store/features/counter'
export class About extends PureComponent {
  addNumberHandle (number) {
    this.props.addNumber(number)
  }
  render () {
    const { counter } = this.props
    return (
      <div>
        <h1>About counter:{counter}</h1>
        <button onClick={() => this.addNumberHandle(1)}>+1</button>
      </div>
    )
  }
}

const mapStateToProps = (state) => {
  return {
    counter: state.counter.value
  }
}

const mapDispatchToProps = (dispatch) => {
  return {
    addNumber: function (number) {
      dispatch(increment(number))
    }
  }
}
export default connect(mapStateToProps, mapDispatchToProps)(About)